
import {createContext ,useContext} from 'react';

//1、createContext方法创建一个上下对象
const MsgContext  = createContext();

//2、在顶层组件 通过 MsgContext.Provider组件提供数据
//3、在底层组件 通过 useContent钩子函数使用数据
function A(){
    return <> 
        <div>我是A</div>
        <B/> 
    </>
}
function B(){
    const msg = useContext(MsgContext); //使用 useContext 钩子函数获取数据
    return  <>{msg}---我是B</>

}
function Text(){
    const msg = '我是父组件 给B组件通信';
    return <>
    <MsgContext.Provider  value={msg}>
        <A/>
    </MsgContext.Provider>
    
    </>
}
export default(Text);